<!--
 * @Descripttion: 
 * @version: 
 * @Author: hutao
 * @Date: 2023-04-24 11:13:39
 * @LastEditors: hutao
 * @LastEditTime: 2023-05-12 09:21:49
-->
<template>
  <div class="temp-content">
    <div class="temp-div">
      <img :src="tempImg" />
      <p class="ht-tips">
        <slot name="tips">
          暂无数据哦
        </slot>
      </p>
      <slot></slot>
    </div>
  </div>
</template>
<script lang="ts">
import { Component, Vue } from "vue-property-decorator";
interface State {
  /** 数据状态 */
  loading: boolean;
}
@Component
export default class Index extends Vue {
  /** 数据 */

  state: State = {
    loading: false,
  };
  /** 生命周期 */
  /** 方法 */
  /** 监听 */
  /** 计算属性 */
  get tempImg() {
    const icon = require("@/assets/temp.svg");

    return icon;
  }
}
</script>
<style lang="scss" scoped>
.temp-content {
  width: 100%;
  text-align: center;
  display: flex;
  justify-content: center;
  align-items: center;

  // height: calc(100vh - 180px);
  // background: #fff;
  //position: relative;

  .temp-div {
    width: 320px;
    // position: absolute;
    // margin-left: -160px;
    margin-top: 0px;
    text-align: center;
    left: 50%;
    .ht-tips {
      height: 30px;
      padding: 0;
      margin: 0;
      line-height: 30px;
      color: #969c98;
    }
  }
}
</style>
